import React, { Component } from 'react'
import PageList from './PageList'

class CommentOn extends React.Component {
    async putWeibo(id, type) {
        await this.$axios.put(`http://bigmoneymaker.xyz:8081/weibo/${id}/${type}`)
        this.props.getWeibo(this.props.pageNo)
    }
    async deleteWeibo(id) {
        await this.$axios.delete('http://bigmoneymaker.xyz:8081/weibo/'+id)
        this.props.getWeibo(this.props.pageNo)
    }

    render() {
        // 对属性解构赋值
        const {contentList} = this.props
        return (
            <>
                <div className="commentOn">
                    <div className="noContent" style={{ display: contentList.length === 0 ? "block" : "none" }}>暂无留言</div>
                    <div className="messList">
                        {
                            contentList.map((item) => (
                                <div key={item._id} className="reply">
                                    <p className="replyContent">{item.content}</p>
                                    <p className="operation">
                                        <span className="replyTime">{item.addTime}</span>
                                        <span className="handle">
                                            <a href="" onClick={(e) => {
                                                e.preventDefault()
                                                this.putWeibo(item._id,1)
                                            }} className="top">{item.topNum}</a>
                                            <a href="" onClick={(e) => {
                                                e.preventDefault()
                                                this.putWeibo(item._id,2)
                                            }} className="down_icon">{item.downNum}</a>
                                            <a href="" onClick={(e) => {
                                                e.preventDefault()
                                                this.deleteWeibo(item._id)
                                            }} className="cut">删除</a>
                                        </span>
                                    </p>
                                </div>
                            ))
                        }
                    </div>
                    <PageList getWeibo={this.props.getWeibo} {...this.props}></PageList>
                </div>
            </>

        )
    }
}

export default CommentOn